<template>
    <div class="TableList">
        <a-table :columns="infoColumns" :data-source="dataList" :loading="loading" :pagination="false">
            <template slot="footer" slot-scope="currentPageData">
                <div class="" style="width: 100%;text-align: center;">
                    <a-button type="link" size="small" @click="handMore" :disabled="isDisabled">{{ isDisabled ? "没有更多了"
                        : '查看更多' }}<a-icon type="double-right" /></a-button>
                </div>
            </template>
        </a-table>
    </div>
</template>

<script>
import { infoColumns } from './js/static';
export default {
    name: 'TableList',
    props: {
        deptid: {
            type: [String, Number],
        }
    },
    data() {
        return {
            infoColumns,
            dataList: [],
            pageSize: 5,
            pageNum: 1,
            loading: false,
            total: 0,
        }
    },
    methods: {
        handMore() {
            let n = this.pageNum + 1;
            this.pageNum = n;
            this.getList({ pageNum: n });
        },
        getList(aParams) {
            let params = {
                pageSize: this.pageSize,
                pageNum: this.pageNum,
                deptid: this.deptid,
                ...aParams,
            };
            this.loading = true;
            this.getAxios(this.$getAppNotClosedLoop, params).then((res) => {
                if (res && res.code == 200) {
                    this.dataList = this.dataList.concat(res.data.records)
                    this.total = res.data.total;
                }
            })
                .finally(() => {
                    this.loading = false;
                });
        },
    },
    computed: {
        isDisabled() {
            let res = false;
            if (this.total <= (this.pageNum * this.pageSize)) {
                res = true;
            }
            return res;
        }
    },
    mounted() {
        this.getList();
        console.log('deptid==', this.deptid);
    },
}
</script>

<style lang="less" scoped>
.TableList {
    ::v-deep {
        .ant-table-thead>tr>th {
            background-color: #DEEEFC !important;
        }
        .ant-table-footer{
            padding: 8px;
        }
    }
}
</style>